import * as THREE from 'three'
import indexedDB from '/src/indexDb/index.js'
import { _getEnentBmp, _getEnentVersion } from '/src/api/event/main.js'
// import { ElMessage } from 'element-plus'

export const addBmp = async (scene) => {
  // 如果版本号不一致 如果有数据则修改 没数据则添加
  const oldVersion = localStorage.getItem('eventBmpVersion') // 旧版本号
  const newInfo = await _getEnentVersion() // 获取最新版本号
  if (newInfo.data.code != 200) return ElMessage.error('获取版本号失败')

  const newVersion = newInfo.data.data.version
  let updateFlage = false // 是否需要更新数据
  if (oldVersion !== newVersion) {
    localStorage.setItem('eventBmpVersion', newVersion) // 更新版本号
    updateFlage = true // 需要更新数据
  }

  // 创建数据库
  const indexDb = new indexedDB()
  const db = await indexDb.open(`storeV4`, 1, 'bmp', { keyPath: 'id', autoIncrement: true })

  // 查询 eventBmp 数据是否存在 如果存在就不创建了
  const isExist = await indexDb.exists(db, 'bmp', 'eventBmp')

  // 如果不存在就请求服务器最新的数据进行存储
  let bmpArrayBuffer = null

  // 如果存在 且不用更新
  if (isExist && !updateFlage) bmpArrayBuffer = isExist.value

  // 如果存在 且需要更新'
  if (isExist && updateFlage) {
    const res = await _getEnentBmp()
    bmpArrayBuffer = res.data
    const dataToUpdate = { id: 'eventBmp', name: 'bmpBufferArray', value: bmpArrayBuffer }
    indexDb.updateByTableName('bmp', dataToUpdate, db)
  }

  // 不存在则直接使用
  if (!isExist) {
    const res = await _getEnentBmp()
    bmpArrayBuffer = res.data
    const dataToAdd = { id: 'eventBmp', name: 'bmpBufferArray', value: bmpArrayBuffer }
    indexDb.addData('bmp', dataToAdd, db)
  }

  const blob = new Blob([bmpArrayBuffer], { type: 'image/bmp' })
  const url = URL.createObjectURL(blob)

  const textureLoader = new THREE.TextureLoader()
  textureLoader.load(url, (texture) => {
    const geometry = new THREE.PlaneGeometry(texture.image.width, texture.image.height)
    const material = new THREE.MeshBasicMaterial({ map: texture })
    const plane = new THREE.Mesh(geometry, material)
    scene.add(plane)
  })
}
